<template>
  <el-form>
    <el-form-item>
      <el-upload
        class="upload-view-loader"
        ref="upload"
        action="action"
        :file-list="files"
        :auto-upload="false"
      >
        <el-button
          slot="trigger"
          size="small"
          type="primary"
        >
          选取文件
        </el-button>
        <el-button
          style="margin-left: 10px;"
          size="small"
          type="success"
          @click="onUpload"
        >
          上传到服务器
        </el-button>
        <div
          slot="tip"
          class="el-upload__tip"
        >
          只能上传jpg/png文件，且不超过500kb
        </div>
      </el-upload>
    </el-form-item>
    <ul>
      <li
        v-for="message in messages"
        :key="message"
      >
        {{ message }}
      </li>
    </ul>
  </el-form>
</template>

<script>
export default {
  props: {
    /**
     * 文件上传API
     */
    action: {
      type: String,
      default: ''
    },
    /**
     * 人员存在校验
     */
    redirect: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      files: [],
      messages: []
    }
  },
  methods: {
    onUpload () {
      this.$refs.upload.submit()
    },
    success () {

    }
  }
}
</script>

<style scoped>

</style>
